<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>

<!DOCTYPE html> 
<html>
<head>
	<title>会员中心</title>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<meta name="format-detection" content="telephone=no">
	<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0,user-scalable=no">
	<meta name="apple-mobile-web-app-capable" content="yes">
	<meta name="apple-mobile-web-app-status-bar-style" content="black">
	<link rel="stylesheet" type="text/css" media="screen" href="${ROOT_PATH }content/css/style.css?v=1.7">
	<script src="${ROOT_PATH }content/scripts/jquery-1.10.1.min.js"></script>
    <script src="${ROOT_PATH }content/scripts/jquery.form.js"></script>
    <script src="${ROOT_PATH }content/scripts/public.js"></script>
    <script src="${ROOT_PATH }content/scripts/artDialog/jquery.artDialog.js?skin=idialog"></script>
    <script src="${ROOT_PATH }content/scripts/artDialog/artDialog.iframeTools.js"></script>
    <script src="${ROOT_PATH }content/scripts/jquery.fancybox.pack.js"></script>
    <script src="${ROOT_PATH }content/scripts/lk.js"></script>
    <script src="${ROOT_PATH }content/scripts/custom-form-elements.min.js"></script>  
    <style type="text/css">
		html{height:100%;}
		body{
			background:url(${ROOT_PATH }content/images/front/amani1_02.png) no-repeat;background-size: 100% 100%;
		}
		#getcode{
			background:url(${ROOT_PATH }content/images/front/amani1_07.png) no-repeat;background-size: 100% 100%;
		}
		#binding{
			background:url(${ROOT_PATH }content/images/front/amani1_11.png) no-repeat;background-size: 100% 100%;
		}
		.xz_kahao{height:100%;margin-bottom: -50px;}
		.xz_kahao .xz_form_div input.lktxt {background: none;	border-color: #ccc;color:#ccc;}
	</style> 
	
</head>
<body>
	<section class="headerBg"></section>
	<section class="xz_kahao">
	    <div class="logo"><img src="${ROOT_PATH }content/images/front/amani1_03.png" width="178" height="30"></div>
	    <form action="${ROOT_PATH }UCenter/index/registElectronic" name="bindform" id="bindform" method="post">
	        <input type="hidden" name="action" id="action" value="save" />
	        <div class="xz_form">
	            <div class="xz_form_div"><input name="realname" type="text" id="realname" placeholder="您的姓名" class="lktxt"></div>
	            <div class="xz_form_div"><input name="mobile" type="text" id="mobile" placeholder="手机号码" class="lktxt"></div>
	            <div class="xz_form_div">&nbsp;&nbsp;&nbsp;&nbsp;<input name="sex" type="radio" value="1" checked="checked">男&nbsp;&nbsp;&nbsp;<input name="sex" type="radio" value="0">女</div>
	            <div class="xz_form_div">
	                <div class="btn"><input name="getcode" type="button" id="getcode" value="" style="cursor:pointer"></div>
	                <div class="txt"><input name="checkcode" type="text" id="checkcode" placeholder="动态密码" class="lktxt"></div>
	            </div>
	            <div class="btn_submit"><input name="submit" type="submit" id="binding" value=""></div>
	        </div>
	    </form>
	    <div style="text-align: right;">
	    	<a href="${ROOT_PATH }UCenter/index/binding" style="text-decoration: underline;font-size:12px;">已有会员卡</a>
	    </div>
	</section>
	<script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
<script>
 $(function () {
	 wx.config({
	        debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
	        appId: '${appId}', // 必填，公众号的唯一标识
	        timestamp:"${jsapi_timestamp}", // 必填，生成签名的时间戳
	        nonceStr: '${jsapi_nonceStr}', // 必填，生成签名的随机串
	        signature: '${jsapi_signature}', // 必填，签名，见附录1
	        jsApiList: ['addCard', 'hideOptionMenu','closeWindow'] // 必填，需要使用的JS接口列表，所有JS接口列表见附录2
	    });
	 wx.ready(function () {
		 wx.hideOptionMenu();               
	 $('#bindform').submit(function () {
                        var options = {
                            beforeSubmit: function () {
                                if (checkCard()) {
                                    var checkcode = $('#checkcode');
                                    if (checkcode.val() == '') {
                                        altTip("请输入手机收到的验证码！", 'error', function () {
                                            checkcode.focus();
                                        });
                                        return false;
                                    }
                                } else {
                                    return false;
                                }
                            },
                            dataType: 'json',
                            success: function (txt) {
                                if (txt.isok) {
                                    //location.href = '${ROOT_PATH }UCenter/sendCard';
                                    //location.href = '${ROOT_PATH }UCenter/my';
                                    
                                    $.ajax({
										 type: "post",
								         url: "${ROOT_PATH}UCenter/sendCard/send",
								         data: {},
								         dataType: "json",
								         success: function (o) { 
								        	var cardInfo={cardId: o.cardId, cardExt: JSON.stringify(o.cardExt)};
								        	var addCardInfo={cardList:[],success: function (res) {
					                            if (res.cardList) {
					                                alert('添加卡包成功');
					                            } else{
					                                altTip('添加卡包失败');
					                            }
					                            location.href = '${ROOT_PATH }UCenter/my';
					                        }};
								        	addCardInfo.cardList.push(cardInfo);
							                wx.addCard(addCardInfo); 
								         }
									});
                                    //
                                    return false;
                                } else {
                                    altTip(txt.error, 'error', function () {});
                                    return false;
                                }
                            }
                        };
                        $('#bindform').ajaxSubmit(options);
                        return false;
                    });
	 });
                    //获取短信验证码
                    $('#getcode').click(function () {
                        if (checkCard()) {
                            var mobile = $("#mobile"), mobile_val = mobile.val(), obj = $(this);
                            $.post('${ROOT_PATH }UCenter/index/getmobilecode', {mobile: mobile_val}, function (o) {
                            	updateEndTime(120);
                            	/*if (o) {
                                    updateEndTime(180);
                                } else {
                                    altTip(o.error, 'error', function () {
                                    	mobile.focus();
                                    });
                                }*/
                                return false;
                            }, 'json');
                        }

                    });
                });

                function updateEndTime(validate) {
                    validate = validate - 1;
                    if (validate > 0) {
                        $('#getcode').attr('disabled', true).val(validate + 'S');
                        setTimeout('updateEndTime(' + validate + ')', 1000);
                    } else {
                        $('#getcode').attr('disabled', false).val('重新获取');
                    }
                }

                function checkCard() {
                    var realname = $("#realname");
                    if (realname.val() == "") {
                        altTip("请输入您的姓名！", 'error', function () {
                            realname.focus();
                        });
                        return false;
                    }
                    var mobile = $("#mobile"), mobile_val = mobile.val();
                    if (mobile_val == "") {
                        altTip("请输入您的手机号码！", 'error', function () {
                            mobile.focus();
                        });
                        return false;
                    } else if (!/^1[0-9]{10}$/.test(mobile_val)) {
                        altTip("您输入的手机号码格式不正确！", 'error', function () {
                            mobile.focus();
                        });
                        return false;
                    }
                    var isok = true;
                    
                    return isok;

                }

$(function(){
   $('img').css('max-width', '100%'); 
});
</script>

	
</body>
</html>